// splitpanes插件
.mix-splitter :deep() .splitpanes--vertical>.splitpanes__splitter {
  width: 7px;
  border: none;
  background: linear-gradient(to right, transparent 49%, #e4e4e4 49%, #e4e4e4 51%, transparent 51%);
}

.mix-splitter :deep()  .splitpanes--vertical .splitpanes__splitter:hover {
  background: linear-gradient(to right, transparent 49%, #0969da 49%, #0969da 51%, transparent 51%);
}

.mix-splitter :deep() .splitpanes--horizontal>.splitpanes__splitter {
  height: 7px;
  border: none;
  background: linear-gradient(to bottom, transparent 49%, #e4e4e4 49%, #e4e4e4 51%, transparent 51%);
}

.mix-splitter :deep()  .splitpanes--horizontal .splitpanes__splitter:hover {
  background: linear-gradient(to bottom, transparent 49%, #0969da 49%, #0969da 51%, transparent 51%);
}

.mix-splitter :deep() .splitpanes__splitter::before {
  display: none;
}

.mix-splitter :deep() .splitpanes__splitter::after {
  display: none;
}


// vue-resizable插件
.mix-splitter :deep() .resizable-component {
  width: 100% !important;
  border-bottom-width: 1px;
  border-color: #e4e4e4;
}

.mix-splitter :deep() .resizable-component:has(.resizable-b:hover) {
  border-color: #0969da;
}
